<template>
  <a-modal :confirmLoading="loading" :open="true" width="800px" title="处理询价单" @ok="onOk" @cancel="onClose">


    <a-divider >基本信息</a-divider>

    <a-descriptions :bordered="true" :column="2" size="small">
      <a-descriptions-item label="询价人">{{ item.name }}</a-descriptions-item>
      <a-descriptions-item label="询价人电话">{{ item.phone }}</a-descriptions-item>
      <a-descriptions-item label="备注">{{ item.remark }}</a-descriptions-item>
      <a-descriptions-item label="提交时间">{{ item.createTime }}</a-descriptions-item>
      <a-descriptions-item label="机源">
        <ItemLink :item="item.item"/>
      </a-descriptions-item>
    </a-descriptions>

    <a-divider >处理</a-divider>

    <a-form :model="state" layout="vertical" :rules="rules" ref="formRef">
      <a-form-item label="处理状态" name="status">
        <a-radio-group v-model:value="state.status">
          <a-radio :value="1">已处理</a-radio>
          <a-radio :value="-1">作废</a-radio>
        </a-radio-group>
      </a-form-item>
      <a-form-item label="备注" name="notes">
        <a-textarea placeholder="请输入处理备注" v-model:value="state.notes" ></a-textarea>            
      </a-form-item>
    </a-form>

  </a-modal>
</template>

<script setup>
import { ref, onMounted, reactive,toRaw} from 'vue';
import { confirm } from '@/mixin';
import { message } from 'ant-design-vue';
import { changeOrderPriceStatus } from '@/api/order';
import ItemLink from '@/components/ItemLink.vue';

const props = defineProps(['item'])
const emit = defineEmits(['close', 'saved'])

const loading = ref()
const formRef = ref()
const state = reactive({
  status: props.item.status,
  notes: props.item.handleNotes,
})
const rules = {
  status: [
    { required: true, message: '请选择处理状态' },
  ],
}

const onOk = () => {
  formRef.value.validate().then(values=>{
    if(values.status == 0){
      message.warn('请选择处理状态')
      return 
    }
    confirm('您确定要保存询价单的处理状态吗？',async ()=>{
      loading.value = true
      const pay = {
        ...values,
        id: props.item.id,
      }
      console.log(pay);
      const res = await changeOrderPriceStatus(pay)
      loading.value = false

      if(res.data){
        message.success('保存成功')
        emit('saved')
      }else{
        message.error(`保存失败: ${res.message || '请稍后再试'}`)
      }
    })
  })
}


const onClose = () => {
  emit('close')
}



</script>

<style lang="less" scoped></style>